.draggable-block-menu {
  border-radius: 3px;
  padding: 1px;
  cursor: grab;
  opacity: 0;
  position: absolute;
  left: -38px;
  top: -2px;
  width: 40px;
  height: 20px;
  will-change: transform;
  transition: opacity 0.15s ease-out;
  pointer-events: none;
  z-index: 2;
  overflow: visible;
  transform-origin: left center;
}

*:hover>.draggable-block-menu,
.draggable-block-menu:hover {
  opacity: 1;
  pointer-events: all;
}

/* 确保菜单在鼠标移动到图标区域时保持显示 */
.draggable-block-menu:hover .icon,
.draggable-block-menu:hover .add-icon {
  opacity: 0.8;
}

.draggable-block-menu-container {
  position: static;
  pointer-events: none;
}

.draggable-block-menu .icon {
  width: 16px;
  height: 16px;
  opacity: 0.4;
  padding: 2px;
  margin: 1px;
  background-image: url();
  background-size: 100%;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 2px;
}

.draggable-block-menu .add-icon {
  width: 16px;
  height: 16px;
  padding: 2px;
  margin: 1px;
  opacity: 0.4;
  cursor: pointer;
  background-image: url();
  background-size: 100%;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 2px;
}

.draggable-block-menu>div:hover {
  opacity: 0.8;
  background-color: hsl(var(--muted) / 0.5);
  transition: all 0.1s ease-out;
}

.draggable-block-menu:active {
  cursor: grabbing;
}

.draggable-block-target-line {
  pointer-events: none;
  background: hsl(var(--primary));
  height: 2px;
  position: absolute;
  left: -1rem;
  top: 0;
  opacity: 0;
  will-change: transform;
  border-radius: 1px;
  box-shadow: 0 0 4px hsl(var(--primary) / 0.3);
}